<template>
  <br />
  <z-list :grid="{ gutter: 16, column: 4 }" :data-source="data">
    <template #renderItem="{ item }">
      <z-list-item>
        <z-card :title="item.title">Card content</z-card>
      </z-list-item>
    </template>
  </z-list>
</template>
<script>
import { defineComponent } from 'vue'
const data = [
  {
    title: 'Title 1'
  },
  {
    title: 'Title 2'
  },
  {
    title: 'Title 3'
  },
  {
    title: 'Title 4'
  }
]
export default defineComponent({
  setup() {
    return {
      data
    }
  }
})
</script>
